<template>
    <div class="my">
        <div class="myInfo">
            <img src="../../assets/images/avanter.png" alt="">
            <div class="info">
                <p>用户名</p>
                <p>id</p>
            </div>
        </div>
        <div class="iconList">
            <div class="item">
                <p class="iconFont">我的订单</p>
            </div>
            <div class="item">
                <p class="iconFont">优惠券</p>
            </div>
            <div class="item">
                <p class="iconFont">我的足迹</p>
            </div>
            <router-link class="item" to="/collectlist" tag="div">
                <p class="iconFont" >我的收藏</p>
            </router-link>
            <router-link class="item" to="/addressSelect"  tag="div">
                <p class="iconFont" >地址管理</p>
            </router-link>
            <div class="item">
                <p class="iconFont">联系客服</p>
            </div>
            <div class="item">
                <p class="iconFont">帮助中心</p>
            </div>
            <router-link class="item" to="/feedback" tag="div">
                <p class="iconFont">意见反馈</p>
            </router-link>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {

        };
    },
};
</script>

<style scoped lang="scss">
.myInfo{
    height: 140px;
    width: 100%;
    display: flex;
    align-items: center;
    background: #333;
    padding: 0 15px;
    box-sizing: border-box;

    img {
        width: 74px;
        height: 74px;
        border-radius: 50%;
    }

    .info{
        color: #fff;
        text-align: left;
        margin-left: 20px;
        font-size: 16px;
    }
}


.iconList {
    display: flex;
    align-items: center;
    background: #fff;
    flex-wrap: wrap;

    .item{
        width: 33.33%;
        padding: .66667rem 0;
        text-align: center;
        border-right: .01333rem solid rgba(0,0,0,.15);
        border-bottom: .01333rem solid rgba(0,0,0,.15);
        box-sizing: border-box;

        .iconFont{
            margin: 0;
            font-size: 16px;
        }
    }

}

</style>
